<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:p="http://primefaces.prime.com.tr/ui">

<ui:composition>


	<h:form prependId="false">

		<p:growl id="messages" showDetail="true" />

		<p:dataTable var="items" value="#{mUser.allAccount}" paginator="true"
			paginatorAlwaysVisible="false" id="user_table" rows="10"
			dynamic="true" onRowEditUpdate="messages"
			rowEditListener="#{mUser.updateRow}">

			<p:column>
				<f:facet name="header"></f:facet>
				<p:rowToggler />
			</p:column>

			<p:column sortBy="#{items.email}" filterBy="#{items.email}"
					filterMatchMode="contains">
				<f:facet name="header">
					<h:outputText value="Email" />
				</f:facet>
				<h:outputText value="#{items.email}" />
			</p:column>

			<p:column sortBy="#{items.name}" filterBy="#{items.name}"
					filterMatchMode="contains">
				<f:facet name="header">
					<h:outputText value="Name" />
				</f:facet>
				<h:outputText value="#{items.name}" />
			</p:column>

			<p:column sortBy="#{items.isVerified}">
				<f:facet name="header">Verified</f:facet>
				<p:cellEditor>
					<f:facet name="output">
						<h:outputText value="#{mUser.verifyToString(items.isVerified)}" />
					</f:facet>
					<f:facet name="input">
						<h:selectBooleanCheckbox value="#{items.isVerified}" />
					</f:facet>
				</p:cellEditor>
			</p:column>


			<p:column sortBy="#{items.status}">
				<f:facet name="header">Status</f:facet>
				<p:cellEditor>
					<f:facet name="output">
						<h:outputText value="#{mUser.validStatus(items.status)}" />
					</f:facet>
					<f:facet name="input">
						<h:selectBooleanCheckbox value="#{items.status}" />
					</f:facet>
				</p:cellEditor>
			</p:column>

			<p:column headerText="Edit">
				<p:rowEditor />
			</p:column>
			
			<p:rowExpansion>
				<div class="box3">
					<div class="image_box">
						<h:graphicImage value="#{mUser.getPath(items.accID)}"
							width="150" height="150"></h:graphicImage>
					</div>
					<div class="prop_info">
						<ul class="list1">
							<li><strong>Join Date: </strong> <h:outputText
									value="#{items.join_date}" /></li>
							<li><strong>Name: </strong> <h:outputText
									value="#{items.name}" /></li>
							<li><strong>ID Number: </strong> <h:outputText
									value="#{items.IDNumber}" /></li>
							<li><strong>Email: </strong> <h:outputText
									value="#{items.email}" /></li>
							<li><strong>Phone Number: </strong> <h:outputText
									value="#{items.phone}" /></li>
						</ul>
					</div>
					<span class="details_link"> 
					<a4j:commandLink styleClass="no-decor" render="editGrid"
							execute="@this" oncomplete="accDialog.show()"> 
						<h:graphicImage value="/resources/images/search-icon.gif"> 
							<b style="color:white">View Details</b> 
						</h:graphicImage>
						<f:setPropertyActionListener target="#{mUser.acc}"
								value="#{items}" />
					</a4j:commandLink> 
					</span>
				</div>
			</p:rowExpansion>

		</p:dataTable>

		<p:dialog header="User Detail" widgetVar="accDialog" resizable="false"
			minWidth="400" showEffect="puff" hideEffect="puff" id="accDialog">
			
				<h:panelGrid id="editGrid" columns="2" cellpadding="4">
							
					<h:outputText value="Join Date:" />
					<h:outputText value="#{mUser.acc.join_date}" />
					
					<h:outputText value="Email:" />
					<h:outputText value="#{mUser.acc.email}" />
							
					<h:outputText value="Name:" />
					<h:inputText value="#{mUser.acc.name}" id="acc_name"
						validator="#{mValidatorLib.FullnameValidator}" />
						
					<h:panelGroup />
					<rich:message for="acc_name" />
	
					<h:outputText value="ID Number:" />
					<h:inputText value="#{mUser.acc.IDNumber}" id="user_id_num"
						validator="#{mValidatorLib.IDNumberValidator}" />
						
					<h:panelGroup />
					<rich:message for="user_id_num" />
	
					<h:outputText value="Country:" />
					<h:selectOneMenu value="#{mUser.acc.country}" id="acc_country">
						<f:selectItem itemValue="Australia" itemLabel="Australia" />
					</h:selectOneMenu>
					
					<h:panelGroup />
					<rich:message for="acc_country" />
	
					<h:outputText value="State:" />
					<h:selectOneMenu value="#{mUser.acc.state}" id="acc_state">
						<f:selectItem itemValue="Sydney" itemLabel="Sydney" />
						<f:selectItem itemValue="Brisbane" itemLabel="Brisbane" />
						<f:selectItem itemValue="Adelaide" itemLabel="Adelaide" />
						<f:selectItem itemValue="Melbourne" itemLabel="Melbourne" />
						<f:selectItem itemValue="Perth" itemLabel="Perth" />
					</h:selectOneMenu>
					
					<h:panelGroup />
					<rich:message for="acc_state" />
	
					<h:outputText value="Address:" />
					<h:inputText value="#{mUser.acc.address}" id="acc_address"
						validator="#{mValidatorLib.AddressValidator}" />
					
					<h:panelGroup />
					<rich:message for="acc_address" />
	
					<h:outputText value="Phone:" />
					<h:inputText value="#{mUser.acc.phone}" id="acc_phone"
						validator="#{mValidatorLib.PhoneValidator}" />
					
					<h:panelGroup />
					<rich:message for="acc_phone" />
	
					<h:outputText value="Question:" />
					<h:selectOneMenu value="#{mUser.acc.question}">
						<f:selectItem itemLabel="What is your ID card number ?"
							itemValue="What is your ID card number ?" />
						<f:selectItem itemLabel="What is your mother's middle name ?"
							itemValue="What is your mother's middle name ?" />
						<f:selectItem itemLabel="What is your lover name ?"
							itemValue="What is your lover name ?" />
						<f:selectItem itemLabel="What is your favorite pet ?"
							itemValue="What is your favorite pet ?" />
					</h:selectOneMenu> 
							
					<h:outputText value="Answer:" />
					<h:inputText value="#{mUser.acc.answer}" id="acc_answer"
						validator="#{mValidatorLib.SecurityAnswerValidator}" />
					
					<h:panelGroup />
					<rich:message for="acc_answer" />
	
					<h:outputText value="Is Verified:" />
					<h:selectBooleanCheckbox value="#{mUser.acc.isVerified}" />
							
					<h:outputText value="Status:" />
					<h:selectBooleanCheckbox value="#{mUser.acc.status}" />
					
					</h:panelGrid>
					
					<a4j:commandButton value="Save" action="#{mUser.update}"
							render="user_table, messages" execute="accDialog"
							oncomplete="if (#{facesContext.maximumSeverity==null}) {#{p:component('accDialog')}.hide();}" />
					<a4j:commandButton value="Cancel" onclick="accDialog.hide(); return false;" />
		</p:dialog>

	</h:form>
</ui:composition>
</html>